<%--
  Created by IntelliJ IDEA.
  User: Lanan
  Date: 2017/12/13 0013
  Time: 19:36
  To change this template use File | Settings | File Templates.
--%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/commons/global.jsp" %>
<html>
<head>
    <%@ include file="/commons/basejs.jsp" %>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>用户收获地址管理</title>
</head>
<body>
<!-- 数据表格 begin -->
<table id="delivery_address_datagrid" title="用户收获地址列表" class="easyui-datagrid"
       data-options="
   		url:'${path}/user/address/list.do',
		fit:true,
		idField:'id',
		rownumbers:true,
		toolbar:'#tools',
		pagination:true,
		fitColumns:true,
		singleSelect:true,
		nowrap:false,
   		">
    <thead>
    <th data-options="field:'id', align:'center', checkbox:true">ID</th>
    <th data-options="field:'userName', align:'center'">用户名</th>
    <th data-options="field:'userPhone', align:'center'">用户电话</th>
    <th data-options="field:'name', align:'center'">收货人名</th>
    <th data-options="field:'phone', align:'center'">收货人电话</th>
    <th data-options="field:'province', align:'center'">省</th>
    <th data-options="field:'city', align:'center'">市</th>
    <th data-options="field:'area', align:'center'">区/县</th>
    <th data-options="field:'address'">详细地址</th>
    <th data-options="field:'updateTime', align:'center', formatter:formatDatebox">更新时间</th>
    <th data-options="field:'def', align:'center', formatter:formatterAddress">是否默认</th>
    </thead>
</table>
<div id="tools">
    <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-reload'" onclick="refreshUserDeliveryAddressList()">刷新</a>

    <shiro:hasPermission name="/user/address/insert.do">
        <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-add'" onclick="insertUserDeliveryAddress()">添加</a>
    </shiro:hasPermission>
    <shiro:hasPermission name="/user/address/update.do">
        <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-edit'" onclick="updateUserDeliveryAddress()">修改</a>
    </shiro:hasPermission>
    <shiro:hasPermission name="/user/address/delete.do">
        <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-remove'" onclick="deleteUserDeliveryAddress()">删除</a>
    </shiro:hasPermission>

    <label>用户:</label>
    <div style="position: relative;height:15px;width:170px;top: 2.5px;display:inline-block;">
        <input type="text" name="searchUserInfo" id="searchUserInfo" value="" hidden/>
        <input type="text" id="autocomplete-ajax-search" style="position: absolute; z-index: 2; background: transparent;"/>
        <input type="text" id="autocomplete-ajax-search-x" disabled="disabled" style="color: #CCC; position: absolute; background: transparent; z-index: 1;"/>
    </div>
    <label>地址:</label>
    <input class="easyui-textbox" id="searchAddressInfo" name="searchAddressInfo" data-options="prompt:'请输入搜索地址关键字'"/>
    <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'" onclick="searchUserDeliveryAddress()">搜索</a>
</div>
<!-- 数据表格 end -->

<!--edit begin-->
<div class="easyui-dialog" id="edit_delivery_address" data-options="closed:true,modal:true,width:600,height:400">
    <form id="edit_delivery_address_form" method="post">
        <table align="center" width="100%" style="margin-top: 20px" cellpadding="4">
            <input type="hidden" id="edit_id" name="id"/>
            <input type="hidden" id="edit_userId" name="userId"/>
            <input type="hidden" id="edit_provinceId" name="provinceId"/>
            <input type="hidden" id="edit_province" name="province"/>
            <input type="hidden" id="edit_cityId" name="cityId"/>
            <input type="hidden" id="edit_city" name="city"/>
            <input type="hidden" id="edit_areaId" name="areaId"/>
            <input type="hidden" id="edit_area" name="area"/>
            <tr>
                <td align="right" width="30%"><lable for="name">收货人姓名:</lable></td>
                <td width="70%">
                    <input id="edit_delivery_address_name" name="name" class="easyui-validatebox" data-options="missingMessage:'请输入收货人姓名', required:true" style="width:260px;"/>
                </td>
            </tr>
            <tr>
                <td align="right" width="30%"><lable for="def">用户:</lable></td>
                <td>
                    <div style="position: relative;height:15px;width:170px;">
                        <input type="text" name="edit_delivery_address_user" id="edit_delivery_address_user" value="" hidden/>
                        <input type="text" id="autocomplete-ajax-edit" class="easyui-validatebox" data-options="missingMessage:'请输入用户信息'" style="position: absolute; z-index: 2; background: transparent;"/>
                        <input type="text" id="autocomplete-ajax-edit-x" disabled="disabled" style="color: #CCC; position: absolute; background: transparent; z-index: 1;"/>
                    </div>
                </td>
            </tr>
            <tr>
                <td align="right" width="30%"><lable for="phone">收货人电话:</lable></td>
                <td width="70%">
                    <input id="edit_delivery_address_phone" name="phone" class="easyui-numberbox" data-options="missingMessage:'请输入收货人电话', validType:'number',min:0, precision:0,required:true" style="width:260px;"/>
                </td>
            </tr>
            <tr>
                <td align="right" width="30%"><lable for="phone">省:</lable></td>
                <td width="70%">
                    <input id="delivery_address_province" class="easyui-combobox"
                           data-options="missingMessage:'请选择省份',
                                         url:'${path}/areaInfo/addressList.do?type=1',
                                         valueField:'id',
                                         textField:'name',
                                         required:true,
                                         editable:false,
                                         onLoadSuccess:function(data){
                                            if(data.length > 0){
                                                if(province != 0){
                                                    $(this).combobox('setValue',province);
                                                }else{
                                                    $(this).combobox('setValue',data[0].id);
                                                }
                                            }
                                         },
                                         onChange: function (newValue, oldValue){
                                             $('#delivery_address_city').combobox('reload','${path}/areaInfo/addressList.do?type=2&pid='+newValue);
                                         },
                                         onSelect:function(data){
                                             province = 0;
                                             city = 0;
                                             area = 0;
                                             $('#edit_provinceId').val(data.id);
                                             $('#edit_province').val(data.name);
                                         }" />
                </td>
            </tr>
            <tr>
                <td align="right" width="30%"><lable for="phone"> 市:</lable></td>
                <td width="70%">
                    <input id="delivery_address_city" class="easyui-combobox "
                           data-options="missingMessage:'请选择城市',
                                         valueField:'id',
                                         textField:'name',
                                         required:true,
                                         editable:false,
                                         onLoadSuccess:function(data){
                                             if(data.length > 0){
                                                if(city != 0){
                                                    $(this).combobox('setValue',city);
                                                }else{
                                                    $(this).combobox('setValue',data[0].id);
                                                    $('#edit_cityId').val(data[0].id);
                                                    $('#edit_city').val(data[0].name);
                                                }
                                             }else{
                                                $('#delivery_address_city').combobox('clear');
                                                $('#edit_cityId').val('');
                                                $('#edit_city').val('');
                                             }
                                         },
                                         onChange: function (newValue, oldValue){
                                             $('#delivery_address_area').combobox('reload','${path}/areaInfo/addressList.do?type=3&pid='+newValue);
                                         },
                                         onSelect:function(data){
                                             city = 0;
                                             area = 0;
                                             $('#edit_cityId').val(data.id);
                                             $('#edit_city').val(data.name);
                                         }"/>
                </td>
            </tr>
            <tr>
                <td align="right"><lable for="phone"> 区:</lable></td>
                <td width="70%">
                    <input id="delivery_address_area" class="easyui-combobox "
                           data-options="missingMessage:'请选择区县' ,
                                         valueField:'id' ,
                                         textField:'name',
                                         editable:false,
                                         onLoadSuccess:function(data){
                                            if(data.length > 0){
                                                if(area != 0){
                                                    $(this).combobox('setValue',area);
                                                }else{
                                                    $(this).combobox('setValue',data[0].id);
                                                    $('#edit_areaId').val(data[0].id);
                                                    $('#edit_area').val(data[0].name);
                                                }
                                            }else{
                                                $('#delivery_address_area').combobox('clear');
                                                $('#edit_areaId').val('');
                                                $('#edit_area').val('');
                                            }
                                         },
                                         onSelect:function(data){
                                             area = 0;
                                             $('#edit_areaId').val(data.id);
                                             $('#edit_area').val(data.name);
                                         }" />
                </td>
            </tr>
            <tr>
                <td align="right"><lable for="address">详细地址:</lable></td>
                <td width="70%">
                    <input id="edit_delivery_address_address" name="address" class="easyui-validatebox" data-options="missingMessage:'请输入收货人详细地址', required:true" style="width:260px;"/>
                </td>
            </tr>
            <tr>
                <td align="right" width="30%"><lable for="def">是否设为默认:</lable></td>
                <td width="70%">
                    <select id="edit_delivery_address_def" class="easyui-combobox" name="def" data-options="required:true,panelHeight:'auto',editable:false" style="width:260px;">
                        <option value="0">否</option>
                        <option value="1">是</option>
                    </select>
                </td>
            </tr>
        </table>
        <div style="margin-top: 20px;text-align: center">
            <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-save'", onclick="handleAddressInfo()">保存</a>
            <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-cancel'", onclick="$('#edit_delivery_address').dialog('close')">取消</a>
        </div>
    </form>
</div>
<!--edit end-->



<script type="text/javascript">
    $(function() {
        $('#edit_delivery_address_phone').numberbox('textbox').attr('maxlength', 11);

        autoCompleteDate('${path}/user/address/autoCompleteData.do', 'autocomplete-ajax-search', 'searchUserInfo', 'autocomplete-ajax-search-x');

        autoCompleteDate('${path}/user/address/autoCompleteData.do', 'autocomplete-ajax-edit', 'edit_delivery_address_user', 'autocomplete-ajax-edit-x');
    })

    function formatterAddress(value) {
        if (value == 0) return '<span style="color:lightgrey">' + '否' + '</span>';
        else if (value == 1) return '<span style="color:black">' + '是' + '</span>';
    }

    function searchUserDeliveryAddress() {
        var queryParams = {};
        queryParams.userId = $("#searchUserInfo").val();
        queryParams.address = $("#searchAddressInfo").val();
        $("#delivery_address_datagrid").datagrid('options').queryParams = queryParams;
        $("#delivery_address_datagrid").datagrid('getPager').data("pagination").options.pageNumber = 1;
        var select = $('#delivery_address_datagrid').datagrid('getSelected');
        if(select != null){
            $('#delivery_address_datagrid').datagrid('clearSelections');
        }
        $("#delivery_address_datagrid").datagrid('reload');
    }

    function refreshUserDeliveryAddressList() {
        $("#delivery_address_datagrid").datagrid('reload');
    }

    function deleteUserDeliveryAddress() {
        lananDelete("delivery_address_datagrid", "确定要删除该地址？", "${path}/user/address/delete.do");
    }

    function insertUserDeliveryAddress() {
        flag = 'add';
        $('#autocomplete-ajax-edit').removeAttr("disabled");
        $("#edit_delivery_address_form").form("clear");
        $("#edit_delivery_address_def").combobox('setValue', 0);
        $("#edit_delivery_address").dialog({title: "添加收货人地址"});

        province = 0;
        city = 0;
        area = 0;

        var val = $("#delivery_address_province").combobox("getData");
        if(val != null && val.length > 0){
            $("#delivery_address_province").combobox("setValue",val[0].id);
            $('#edit_provinceId').val(val[0].id);
            $('#edit_province').val(val[0].name);
        }

        $("#edit_delivery_address").dialog("open");
    }

    var province = 0;
    var city = 0;
    var area = 0;

    function updateUserDeliveryAddress() {
        flag = 'update';
        var select = $("#delivery_address_datagrid").datagrid("getSelected");
        if(select == null){
            $.messager.alert("提示","请选择要修改的地址！","info");
            return;
        }

        province = select.provinceId;
        city = select.cityId;
        area = select.areaId;

        $('#autocomplete-ajax-edit').val(select.userPhone + ':' + select.userName);
        $('#autocomplete-ajax-edit').attr("disabled", "disabled");
        $('#edit_delivery_address_user').val(select.userId);

        // 省
        $('#delivery_address_province').combobox('setValue', select.provinceId);

        // 市
        $('#delivery_address_city').combobox('setValue', select.cityId);

        // 区
        $('#delivery_address_area').combobox('setValue', select.areaId);

        $("#edit_delivery_address_form").form("load", select);
        $("#edit_delivery_address").dialog({title: "修改收货人地址"});
        $("#edit_delivery_address").dialog("open");
    }

    function handleAddressInfo() {
        var url = '';
        var msg = '';
        var userId = '';
        if (flag == 'add') {
            url = '${path}/user/address/insert.do';
            msg = '添加';
            userId = $("#edit_delivery_address_user").val();
            if (userId == null || userId == "" || userId.length <= 0) {
                $.messager.alert("提示","用户不存在！！","info");
                return;
            }
            $("#edit_userId").val(userId);
        } else if (flag == 'update') {
            url = '${path}/user/address/update.do';
            msg = '修改';
        }
        $.messager.progress();
        $("#edit_delivery_address_form").form("submit",{
            url:url,
            onSubmit:function(){
                var valid = $(this).form("validate");
                if (!valid) {
                    $.messager.progress("close");
                }
                return valid;
            },
            success:function(data){
                data=$.parseJSON(data);
                $.messager.progress("close");
                if(data.success){
                    $("#edit_delivery_address").dialog("close");
                    $.messager.show({
                        title: msg + "成功",msg: msg + "成功!",
                        timeout:600,style:"left:30%;top:10%",
                        showType:"fade"
                    });
                    $("#delivery_address_datagrid").datagrid("reload");
                    $('#delivery_address_datagrid').datagrid('clearSelections');
                }else{
                    $.messager.alert(msg + "失败", data.msg,"error");
                }
            },
            error:function () {
                $.messager.progress("close");
                $.messager.alert("操作失败", "服务器连接失败!","error");
            }
        });
    }


</script>


</body>
</html>
